<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JS事件监听</title>
</head>
<body>
<button>按钮</button>
<h4>震惊：专家建议空腹不要吃饭</h4>
<script>
    let h4E=document.querySelector('h4');
    // 鼠标移入事件 mouseover
    h4E.addEventListener("mouseover",function (){
        console.log('标题被（悬停）了！！')
    });
    /* 点击事件 click*/
    let buttonE=document.querySelector('button');
    //给按钮元素绑定监听事件，只要点击，就会触发function中的代码
    buttonE.addEventListener('click',function (){
        alert('按钮被点击了')
    });
    /*window是DOM自带的对象，他是一个全局对象，代表了当前浏览器窗口
    * resize监听修改窗口大小的时事件
    * scroll监听窗口滚动条滚动事件*/
    window.addEventListener("resize",function (){
        alert('窗口被设置大小了');
    });
    window.addEventListener("scroll",function (){
        alert('窗口的滚动条滚动了!');
    });


</script>
</body>
</html>